
<!-- BEGIN:main -->

<script language="javascript" type="text/javascript">        
    jQuery(document).ready(function($){   
        
        
        $('#lbCustomerName').hide();
        $('#lbPhoneNumber').hide();
        $('#lbAddress').hide();
        $('#lbEmail').hide();
        $('#lbProvine').hide();
        
        
        // add a new property
        $('#btDestroyCart').click(function(){
            
            $('#hdAction').val('destroy');
            $('#frmCart').submit();
        }); 
        
        
        
        
        
        // payment click
        $('#btPayment').click(function(){
            $('#hdAction').val('payment');
            
            $('#lbCustomerName').hide();
            $('#lbPhoneNumber').hide();
            $('#lbAddress').hide();
            $('#lbEmail').hide();
            $('#lbProvine').hide();
            
            var txtCustomerName = $('#txtCustomerName');
            var txtPhoneNumber = $('#txtPhoneNumber');
            var txtAddress = $('#txtAddress');
            var txtEmail = $('#txtEmail');
            var slProvine = $('#slProvine');
            
            if(txtCustomerName.val() == ''){
                $('#lbCustomerName').html('Vui lòng nhập tên khách hàng');
                $('#lbCustomerName').show();
                txtCustomerName.focus();
            }else if(txtPhoneNumber.val() == ''){
                $('#lbPhoneNumber').html('Vui lòng nhập số điện thoại');
                $('#lbPhoneNumber').show();
                txtPhoneNumber.focus();
            }else if(txtAddress.val() == ''){
                $('#lbAddress').html('Vui lòng nhập địa chỉ');
                $('#lbAddress').show(); 
                txtAddress.focus();
            }else if(txtEmail.val() == ''){
                $('#lbEmail').html('Vui lòng nhập email');
                $('#lbEmail').show(); 
                txtEmail.focus();                
            }else if(slProvine.val() == ''){
                $('#lbEmail').html('Vui lòng nhập tỉnh thành');
                $('#lbEmail').show(); 
                slProvine.focus();                  
            }else {
                $('#frmCart').submit();
            }            
        });   
        
        
    });
</script>



<div class="d_component">

    <div class="d_title_component1" style="text-align: left">
        Xác nhận giỏ hàng và thông tin người mua
    </div>


    <div class="d_content_component">


        <form  action="" method="post" id="frmCart" name="frmCart">   
            <input type="hidden" id="hdAction" name="hdAction" value="" />

          

            <div style="color:#666;font:500 17px arial;font-weight: 500;margin-left:10px;">Vui lòng nhập chính xác thông tin để chúng tôi có thể hỗ trợ tốt nhất cho bạn</div>
            <div class="d_divide10"></div>
            <fieldset class="d_border_radius5" style="height: 260px; padding: 5px;width: 50%;float: left;margin-left:10px;">
                <legend style="color:#666;font:700 14px arial;font-weight: 700;">Thông tin người mua</legend>

                <div class="d_field_row">
                    <div class="d_label">Họ và Tên <span class="d_asterisk">*</span></div>

                    <input class="d_text_input d_border_radius3" style="width: 250px" name="txtCustomerName" id="txtCustomerName" />                
                    <span id="lbCustomerName" style="color: red"></span>
                </div>

                <div class="d_field_row">
                    <div class="d_label">Giới tính</div>


                    <div style="line-height: 25px;float: left">

                        <input type="radio" name="rdoGender" checked value="1" />
                        Nam
                        <input type="radio" name="rdoGender" value="0" />
                        Nữ
                    </div>
                </div>     

                <div class="d_clear"></div>


                <div class="d_field_row">
                    <div class="d_label">Điện thoại <span class="d_asterisk">*</span></div>

                    <input class="d_text_input d_border_radius3" style="width: 250px" name="txtPhoneNumber" id="txtPhoneNumber" />                
                    <span id="lbPhoneNumber" style="color: red"></span>
                </div>


                <div class="d_field_row">
                    <div class="d_label">Địa chỉ <span class="d_asterisk">*</span></div>

                    <input class="d_text_input d_border_radius3" style="width: 250px" name="txtAddress" id="txtAddress" />                
                    <span id="lbAddress" style="color: red"></span>
                </div>


                <div class="d_field_row">
                    <div class="d_label">Email <span class="d_asterisk">*</span></div>

                    <input class="d_text_input d_border_radius3"  style="width: 250px" name="txtEmail" id="txtEmail" />                
                    <span id="lbEmail" style="color: red"></span>
                </div>   

                <div class="d_field_row">
                    <div class="d_label">Tỉnh thành <span class="d_asterisk">*</span></div>                    
                    <select class="d_text_input d_border_radius3" style="width: 250px" name="slProvine"  id="slProvine">
                        <!-- BEGIN:provine_list -->
                        <option value="{P_ID}">{P_Name}</option>
                        <!-- END:provine_list -->
                    </select>    
                    <span id="lbProvine" style="color: red"></span>
                </div>  

                <div class="d_field_row">
                    <div class="d_label">Ghi chú</div>
                    <textarea style="width: 250px" name="txtDescription" id="txtDescription"></textarea>               
                </div>                 

            </fieldset>


        <fieldset class="d_border_radius5" style="height: 260px; text-align: left; padding: 5px;width: 43%;float: right;margin-right:10px;">
                <legend style="color:#666;font:700 14px arial;font-weight: 700;">Tài khoản ngân hàng</legend>
                <ul style="margin: 0; padding: 0 0 0 10px">
                    <li type="circle">Số tài khoản tại Ngân hàng
                        <ul style="margin: 0; padding: 0 0 0 10px">
                            <li type="disc">Vietcombank - Sở giao dịch: </li>
                            <li type="disc">Vietinbank - Chi nhánh Thanh Xuân: </li>
                        </ul>
                    </li>
                </ul>

            </fieldset>


            <div class="d_divide10"></div>

            <div class="d_divide10"></div>
            <fieldset class="d_border_radius5" style="margin:10px;">
                <legend style="color:#666;font:700 14px arial;font-weight: 700;">Thông tin sản phẩm</legend>



               <table width="100%"  cellspacing="0" cellpadding="0" class="list" style="padding:10px">
                <thead>
                    <tr style="background:#89C01C;height:50px;">
                        <th style="width: 10%;text-align: center;">Hình ảnh</th>
                        <th style="width: 30%;text-align: center;">Tên sản phẩm</th>
                        <th style="width: 15%;text-align: center;">Đơn giá</th>
                        <th style="width: 13%;text-align: center;">Số lượng</th>
                        <th  style="width: 32%;text-align: center;" >Thành tiền</th>
                        <th></th>
                    </tr>
                </thead>


                    <tbody>
                        <!--    BEGIN:item_list -->
                        <tr>
                            <td><img width="50px" height="50px" style="border-radius:50%; " alt="{ITEM_ID}" src="{ITEM_IMAGE}"></td>

                            <td style="text-align: left;color:#444;font:550 13px arial;font-weight: 550;">{ITEM_NAME} </td>

                            <td style="color:#3A9504;text-align: center">{ITEM_PRICE} (VNĐ)</td>

                            <td style="text-align: center">                            
                                <b><span id="qty_15899" class="qty">{ITEM_QUANTITY}</span></b>
                            </td>

                            <td style="text-align: center">
                                <b><span id="total_each_item">{TOTAL_EACH_ITEM} (VNĐ)</span></b>
                            </td>

                        </tr>  
                        <!-- END:item_list -->
                    </tbody>


                     <tfoot >
                    <tr >
                        <td style="border-top: 1px dashed #CCC;padding-top:10px;text-align:right;padding-bottom:20px;" colspan="2">
                            
                                <!-- BEGIN:action_button -->
                                <div style="text-align: left">
                                    <a class=" btDestroyCart d_button" href="javascript:void()" id="btDestroyCart" >Hủy đơn hàng</a>                            
                                    <a class=" d_button" href="javascript:void()" id="btPayment">Thanh toán</a> 
                                </div>
                                <!-- END:action_button -->

                         
                        </td>



                        <td style="border-top: 1px dashed #CCC;padding-top:10px;padding-bottom:20px;text-align:right;color:#444;font:700 14px arial;font-weight: 700;padding-right:50px;" colspan="2">Tính tổng</td>
                        <td style="text-align: center;padding-top:10px;padding-bottom:20px;border-top: 1px dashed #CCC;color:#444;font:700 14px arial;font-weight: 700">{TOTAL} (VNĐ)
                           
                        </td>
                         <td style="border-top: 1px dashed #CCC;padding-top:10px;padding-bottom:20px;"></td>
                    </tr>
                </tfoot>  
                </table>




            </fieldset>
        </form>

    </div>
</div>
<!-- END:main -->



